<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>
        Load Awesome
    </title>
    <meta name="description" content="An awesome collection of — Pure CSS — Loaders and Spinners">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta property="og:type" content="website" />
    <meta property="og:site_name" content="Load Awesome" />
    <meta property="og:url" content="http://github.danielcardoso.net/load-awesome/" />
    <meta property="og:title" content="Load Awesome" />
    <meta property="og:description" content="An awesome collection of — Pure CSS — Loaders and Spinners" />
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="assets/style.css" />
    <link rel="stylesheet" type="text/css" href="assets/loaders.css" />
</head>
<body>
    <div class="wrapper nano" style="background-color: #87c4a3; color: #87c4a3;">
        <div class="nano-content">
            <a href="https://github.com/danielcardoso/load-awesome" target="_blank" style="position: absolute; top: 0; left: 0; border: 0; z-index: 20;">
                <img style="position: absolute; top: 0; left: 0; border: 0;" src="https://camo.githubusercontent.com/c6286ade715e9bea433b4705870de482a654f78a/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f77686974655f6666666666662e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_left_white_ffffff.png">
            </a>
            <header class="absolute">
                <div class="la-docs-header-container">
                    <div class="left">
                        <h1 class="title">Load <span>Awesome</span></h1>
                    </div>
                    <div class="right text-right">
                        <span class="buttongroup">
                            <a href="./" class="button button-circle active">
                                Home
                            </a>
                            <a href="animations.html" class="button button-circle">
                                Animations
                            </a>
                        </span>
                    </div>
                    <div class="cf"></div>
                </div>
            </header>
            <main class="la-docs-social-sharing-container">
                <div class="la-docs-info-container text-center">
                    <span class="la-docs-icon"></span>
                    <h2>An awesome collection of — Pure CSS — Loaders and Spinners</h2>
                    <p>
                        <a href="https://github.com/danielcardoso/load-awesome/releases/latest" class="button large">
                            <i class="fa fa-download"></i> Download
                        </a>
                    </p>
                    <p class="version">Currently v1.1.0</p>
                </div>
                <div class="social-sharing header__share-buttons" data-permalink="http%3A%2F%2Fgithub.danielcardoso.net%2Fload-awesome%2F" data-permalink-github="danielcardoso/load-awesome">
                    <small class="social-sharing-title">Share: </small>
                    <a target="_blank" href="http://www.facebook.com/sharer.php?u=http%3A%2F%2Fgithub.danielcardoso.net%2Fload-awesome%2F" class="share-facebook">
                        <span class="fa fa-facebook"></span>
                        <span class="share-title">Share</span>
                        <span class="share-count">0</span>
                    </a>
                    <a target="_blank" href="http://twitter.com/share?url=http%3A%2F%2Fgithub.danielcardoso.net%2Fload-awesome%2F&amp;text=Load%20Awesome%2C%20An%20awesome%20collection%20of%20%E2%80%94%20Pure%20%23CSS%20%E2%80%94%20%23Loaders%20and%20%23Spinners" class="share-twitter">
                        <span class="fa fa-twitter"></span>
                        <span class="share-title">Tweet</span>
                        <span class="share-count">0</span>
                    </a>
                    <a target="_blank" href="http://plus.google.com/share?url=http%3A%2F%2Fgithub.danielcardoso.net%2Fload-awesome%2F" class="share-google">
                        <span class="fa fa-google-plus"></span>
                        <span class="share-title">+1</span>
                        <span class="share-count">0</span>
                    </a>
                    <a target="_blank" href="https://github.com/danielcardoso/load-awesome" class="share-github">
                        <span class="fa fa-github-alt"></span>
                        <span class="share-title">GitHub</span>
                        <span class="share-count">0</span>
                    </a>
                    <span>
                        <a class="twitter-follow-button" href="https://twitter.com/DanielCardoso" data-show-count="true" data-lang="en">
                        Follow @DanielCardoso
                        </a>
                        <script>
                        window.twttr = (function(d, s, id) {
                            var js, fjs = d.getElementsByTagName(s)[0],
                                t = window.twttr || {};
                            if (d.getElementById(id)) return t;
                            js = d.createElement(s);
                            js.id = id;
                            js.src = "https://platform.twitter.com/widgets.js";
                            fjs.parentNode.insertBefore(js, fjs);
                            t._e = [];
                            t.ready = function(f) {
                                t._e.push(f);
                            };
                            return t;
                        }(document, "script", "twitter-wjs"));
                        </script>
                    </span>
                </div>
            </main>
            <div class="la-docs-features bg-light">
                <main>
                    <div class="row">
                        <div class="col-sm-6">
                            <h4>
                                <i class="fa fa-spinner"></i> 53 Animations</h4> And this number continues to grow.
                        </div>
                        <div class="col-sm-6">
                            <h4>
                                <i class="fa fa-css3"></i> CSS Control</h4> Easily style animation color only using CSS.
                        </div>
                        <div class="col-sm-6">
                            <h4>
                                <i class="fa fa-ban"></i> No JavaScript Required</h4> Fewer compatibility concerns because Load Awesome doesn't require JavaScript.
                        </div>
                        <div class="col-sm-6">
                            <h4>
                                <i class="fa fa-eye"></i> Perfect on Retina Displays</h4> Load Awesome animations are not images, which mean they're awesome on HD displays.
                        </div>
                    </div>
                </main>
            </div>
            <main class="la-docs-footer">
                <footer>
                    <ul class="la-docs-footer-links">
                        <li>
                            Load Awesome 1.1.0
                        </li>
                        <li>·</li>
                        <li>Created by <a href="https://twitter.com/DanielCardoso" target="_blank">@DanielCardoso</a></li>
                        <li>·</li>
                        <li>Licensed under
                            <a rel="license" href="https://github.com/danielcardoso/load-awesome/blob/master/LICENSE" target="_blank">
                                MIT
                            </a>
                        </li>
                    </ul>
                    <ul class="la-docs-footer-links">
                        <li><a href="https://github.com/danielcardoso/load-awesome" target="_blank">GitHub Project</a></li>
                        <li>·</li>
                        <li><a href="https://github.com/danielcardoso/load-awesome/blob/master/CHANGELOG" target="_blank">Changelog</a></li>
                        <li>·</li>
                        <li><a href="https://github.com/danielcardoso/load-awesome/issues" target="_blank">Issues</a></li>
                        <li>·</li>
                        <li><a href="https://github.com/danielcardoso/load-awesome/releases" target="_blank">Releases</a></li>
                    </ul>
                </footer>
            </main>
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="assets/plugins.min.js"></script>
    <script src="assets/script.min.js"></script>
</body>
</html>